<template>
  <div class="common-layout">
    <el-container>
      <el-aside width="auto">
       <mo-menu :collapse="Collapse"/>
          <Menu3> </Menu3>
      </el-aside>
      <el-container>
        <el-header> <mo-header v-model:collapse="Collapse" /> </el-header>
        <el-main>Main

          <Menu2> </Menu2>
        </el-main>
        <el-footer>Footer</el-footer>
      </el-container>
    </el-container>
  </div>
</template>



<script lang="ts">
import { defineComponent,ref } from 'vue'
// import MoMenu from '~/composables/menu/sideMenu.vue'
// import MoHeader from '~/composables/mo_Header.vue'
// import Menu2 from '~/composables/mo_Menu.vue'
// import Menu3 from '~/composables/menu/mo_menu2.vue'

export default defineComponent({
    name:"moHome",
    components:{                                             //引入子组件
            // MoMenu,
            // MoHeader,
            // Menu2,
            // Menu3
        },
    setup () {
      const Collapse = ref(false);

      return {
        Collapse
      }
      
    }
})
</script>

<style leng='less' scoped>
.el-container{
    height: 100%;
}

.el-header{
    background-color: #fff;
}

</style>